/**
 * 统一导航栏样式 
 */

/* 基础导航栏样式 */
#navbar > div {
    background: var(--card-bg);
    border: 1px solid transparent;
    border-radius: 0 0 0.75rem 0.75rem;
    transition: all var(--duration-medium) var(--ease-standard);
}

/* 半透明模式 - 桌面端 */
@media (min-width: 1024px) {
    /* Banner模式半透明效果 */
    #banner-wrapper ~ * #navbar[data-transparent-mode="semi"] > div,
    body:has(#banner-wrapper) #navbar[data-transparent-mode="semi"] > div {
        backdrop-filter: blur(var(--blur-2xl)) !important;
        background: rgba(255, 255, 255, var(--opacity-55)) !important;
        border: 1px solid rgba(255, 255, 255, var(--opacity-55)) !important;
        border-radius: 0 0 0.75rem 0.75rem !important;
        box-shadow: var(--shadow-navbar) !important;
        transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    }

    /* 壁纸模式半透明效果 */
    body.wallpaper-transparent #navbar[data-transparent-mode="semi"] > div {
        backdrop-filter: blur(var(--blur-2xl)) !important;
        background: rgba(255, 255, 255, var(--opacity-55)) !important;
        border: 1px solid rgba(255, 255, 255, var(--opacity-55)) !important;
        border-radius: 0 0 0.75rem 0.75rem !important;
        box-shadow: var(--shadow-navbar) !important;
        transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    }

    /* 完全透明模式 - Banner */
    #banner-wrapper ~ * #navbar[data-transparent-mode="full"] > div,
    body:has(#banner-wrapper) #navbar[data-transparent-mode="full"] > div {
        backdrop-filter: none !important;
        background: transparent !important;
        border: none !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    }

    /* 完全透明模式 - 壁纸 */
    body.wallpaper-transparent #navbar[data-transparent-mode="full"] > div {
        backdrop-filter: none !important;
        background: transparent !important;
        border: none !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    }

    /* 半完全透明模式 - Banner */
    #banner-wrapper ~ * #navbar[data-transparent-mode="semifull"] > div,
    body:has(#banner-wrapper) #navbar[data-transparent-mode="semifull"] > div {
        backdrop-filter: none !important;
        background: transparent !important;
        border: 1px solid transparent !important;
        border-radius: 0 0 0.75rem 0.75rem !important;
        box-shadow: none !important;
        transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    }

    /* 滚动状态 - Banner */
    #banner-wrapper ~ * #navbar[data-transparent-mode="semifull"].scrolled > div,
    body:has(#banner-wrapper) #navbar[data-transparent-mode="semifull"].scrolled > div {
        backdrop-filter: blur(var(--blur-2xl)) !important;
        background: rgba(255, 255, 255, var(--opacity-55)) !important;
        border: 1px solid rgba(255, 255, 255, var(--opacity-55)) !important;
        border-radius: 0 0 0.75rem 0.75rem !important;
        box-shadow: var(--shadow-navbar) !important;
        transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    }

    /* 半完全透明模式 - 壁纸 */
    body.wallpaper-transparent #navbar[data-transparent-mode="semifull"] > div {
        backdrop-filter: blur(var(--blur-2xl)) !important;
        background: rgba(255, 255, 255, var(--opacity-55)) !important;
        border: 1px solid rgba(255, 255, 255, var(--opacity-55)) !important;
        border-radius: 0 0 0.75rem 0.75rem !important;
        box-shadow: var(--shadow-navbar) !important;
        transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    }

    /* 滚动状态 - 壁纸 */
    body.wallpaper-transparent #navbar[data-transparent-mode="semifull"].scrolled > div {
        backdrop-filter: blur(var(--blur-2xl)) !important;
        background: rgba(255, 255, 255, var(--opacity-55)) !important;
        border: 1px solid rgba(255, 255, 255, var(--opacity-55)) !important;
        border-radius: 0 0 0.75rem 0.75rem !important;
        box-shadow: var(--shadow-navbar) !important;
        transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    }
}

/* 移动端半透明模式 - 仅在有banner且为首页时启用 */
@media (max-width: 1023px) {
    /* Banner模式 */
    #banner-wrapper ~ * #navbar[data-transparent-mode="semi"][data-is-home="true"] > div,
    body:has(#banner-wrapper) #navbar[data-transparent-mode="semi"][data-is-home="true"] > div {
        backdrop-filter: blur(var(--blur-2xl)) !important;
        background: rgba(255, 255, 255, var(--opacity-55)) !important;
        border: 1px solid rgba(255, 255, 255, var(--opacity-55)) !important;
        border-radius: 0 0 0.75rem 0.75rem !important;
        box-shadow: var(--shadow-navbar) !important;
        transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    }

    /* 壁纸模式 */
    body.wallpaper-transparent #navbar[data-transparent-mode="semi"][data-is-home="true"] > div {
        backdrop-filter: blur(var(--blur-2xl)) !important;
        background: rgba(255, 255, 255, var(--opacity-55)) !important;
        border: 1px solid rgba(255, 255, 255, var(--opacity-55)) !important;
        border-radius: 0 0 0.75rem 0.75rem !important;
        box-shadow: var(--shadow-navbar) !important;
        transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    }

    /* 完全透明模式 - Banner */
    #banner-wrapper ~ * #navbar[data-transparent-mode="full"][data-is-home="true"] > div,
    body:has(#banner-wrapper) #navbar[data-transparent-mode="full"][data-is-home="true"] > div {
        backdrop-filter: none !important;
        background: transparent !important;
        border: none !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    }

    /* 完全透明模式 - 壁纸 */
    body.wallpaper-transparent #navbar[data-transparent-mode="full"][data-is-home="true"] > div {
        backdrop-filter: none !important;
        background: transparent !important;
        border: none !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    }

    /* 半完全透明模式 - Banner */
    #banner-wrapper ~ * #navbar[data-transparent-mode="semifull"][data-is-home="true"] > div,
    body:has(#banner-wrapper) #navbar[data-transparent-mode="semifull"][data-is-home="true"] > div {
        backdrop-filter: none !important;
        background: transparent !important;
        border: 1px solid transparent !important;
        border-radius: 0 0 0.75rem 0.75rem !important;
        box-shadow: none !important;
        transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    }

    /* 滚动状态 - Banner */
    #banner-wrapper ~ * #navbar[data-transparent-mode="semifull"][data-is-home="true"].scrolled > div,
    body:has(#banner-wrapper) #navbar[data-transparent-mode="semifull"][data-is-home="true"].scrolled > div {
        backdrop-filter: blur(var(--blur-2xl)) !important;
        background: rgba(255, 255, 255, var(--opacity-55)) !important;
        border: 1px solid rgba(255, 255, 255, var(--opacity-55)) !important;
        border-radius: 0 0 0.75rem 0.75rem !important;
        box-shadow: var(--shadow-navbar) !important;
        transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    }

    /* 半完全透明模式 - 壁纸 */
    body.wallpaper-transparent #navbar[data-transparent-mode="semifull"][data-is-home="true"] > div {
        backdrop-filter: blur(var(--blur-2xl)) !important;
        background: rgba(255, 255, 255, var(--opacity-55)) !important;
        border: 1px solid rgba(255, 255, 255, var(--opacity-55)) !important;
        border-radius: 0 0 0.75rem 0.75rem !important;
        box-shadow: var(--shadow-navbar) !important;
        transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    }

    /* 滚动状态 - 壁纸 */
    body.wallpaper-transparent #navbar[data-transparent-mode="semifull"][data-is-home="true"].scrolled > div {
        backdrop-filter: blur(var(--blur-2xl)) !important;
        background: rgba(255, 255, 255, var(--opacity-55)) !important;
        border: 1px solid rgba(255, 255, 255, var(--opacity-55)) !important;
        border-radius: 0 0 0.75rem 0.75rem !important;
        box-shadow: var(--shadow-navbar) !important;
        transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    }
}

/* 暗色主题下的半透明效果 - 桌面端 */
@media (min-width: 1024px) {
    /* Banner模式暗色主题 */
    :root.dark #banner-wrapper ~ * #navbar[data-transparent-mode="semi"] > div,
    :root.dark body:has(#banner-wrapper) #navbar[data-transparent-mode="semi"] > div {
        background: rgba(0, 0, 0, var(--opacity-55)) !important;
        border: 1px solid rgba(0, 0, 0, var(--opacity-55)) !important;
        box-shadow: var(--shadow-navbar-dark) !important;
    }

    /* 壁纸模式暗色主题 */
    :root.dark body.wallpaper-transparent #navbar[data-transparent-mode="semi"] > div {
        background: rgba(0, 0, 0, var(--opacity-55)) !important;
        border: 1px solid rgba(0, 0, 0, var(--opacity-55)) !important;
        box-shadow: var(--shadow-navbar-dark) !important;
    }

    /* 完全透明模式暗色主题 - Banner */
    :root.dark #banner-wrapper ~ * #navbar[data-transparent-mode="full"] > div,
    :root.dark body:has(#banner-wrapper) #navbar[data-transparent-mode="full"] > div {
        background: transparent !important;
        border: none !important;
        box-shadow: none !important;
    }

    /* 完全透明模式暗色主题 - 壁纸 */
    :root.dark body.wallpaper-transparent #navbar[data-transparent-mode="full"] > div {
        background: transparent !important;
        border: none !important;
        box-shadow: none !important;
    }

    /* 半完全透明模式暗色主题 - Banner */
    :root.dark #banner-wrapper ~ * #navbar[data-transparent-mode="semifull"] > div,
    :root.dark body:has(#banner-wrapper) #navbar[data-transparent-mode="semifull"] > div {
        background: transparent !important;
        border: 1px solid transparent !important;
        box-shadow: none !important;
    }

    /* 滚动状态暗色主题 - Banner */
    :root.dark #banner-wrapper ~ * #navbar[data-transparent-mode="semifull"].scrolled > div,
    :root.dark body:has(#banner-wrapper) #navbar[data-transparent-mode="semifull"].scrolled > div {
        background: rgba(0, 0, 0, var(--opacity-55)) !important;
        border: 1px solid rgba(0, 0, 0, var(--opacity-55)) !important;
        box-shadow: var(--shadow-navbar-dark) !important;
    }

    /* 半完全透明模式暗色主题 - 壁纸 */
    :root.dark body.wallpaper-transparent #navbar[data-transparent-mode="semifull"] > div {
        background: rgba(0, 0, 0, var(--opacity-55)) !important;
        border: 1px solid rgba(0, 0, 0, var(--opacity-55)) !important;
        box-shadow: var(--shadow-navbar-dark) !important;
    }

    /* 滚动状态暗色主题 - 壁纸 */
    :root.dark body.wallpaper-transparent #navbar[data-transparent-mode="semifull"].scrolled > div {
        background: rgba(0, 0, 0, var(--opacity-55)) !important;
        border: 1px solid rgba(0, 0, 0, var(--opacity-55)) !important;
        box-shadow: var(--shadow-navbar-dark) !important;
    }
}

/* 移动端暗色主题 */
@media (max-width: 1023px) {
    /* Banner模式暗色主题 */
    :root.dark #banner-wrapper ~ * #navbar[data-transparent-mode="semi"][data-is-home="true"] > div,
    :root.dark body:has(#banner-wrapper) #navbar[data-transparent-mode="semi"][data-is-home="true"] > div {
        background: rgba(0, 0, 0, var(--opacity-55)) !important;
        border: 1px solid rgba(0, 0, 0, var(--opacity-55)) !important;
        box-shadow: var(--shadow-navbar-dark) !important;
    }

    /* 壁纸模式暗色主题 */
    :root.dark body.wallpaper-transparent #navbar[data-transparent-mode="semi"][data-is-home="true"] > div {
        background: rgba(0, 0, 0, var(--opacity-55)) !important;
        border: 1px solid rgba(0, 0, 0, var(--opacity-55)) !important;
        box-shadow: var(--shadow-navbar-dark) !important;
    }

    /* 完全透明模式暗色主题 - Banner */
    :root.dark #banner-wrapper ~ * #navbar[data-transparent-mode="full"][data-is-home="true"] > div,
    :root.dark body:has(#banner-wrapper) #navbar[data-transparent-mode="full"][data-is-home="true"] > div {
        background: transparent !important;
        border: none !important;
        box-shadow: none !important;
    }

    /* 完全透明模式暗色主题 - 壁纸 */
    :root.dark body.wallpaper-transparent #navbar[data-transparent-mode="full"][data-is-home="true"] > div {
        background: transparent !important;
        border: none !important;
        box-shadow: none !important;
    }

    /* 半完全透明模式暗色主题 - Banner */
    :root.dark #banner-wrapper ~ * #navbar[data-transparent-mode="semifull"][data-is-home="true"] > div,
    :root.dark body:has(#banner-wrapper) #navbar[data-transparent-mode="semifull"][data-is-home="true"] > div {
        background: transparent !important;
        border: 1px solid transparent !important;
        box-shadow: none !important;
    }

    /* 滚动状态暗色主题 - Banner */
    :root.dark #banner-wrapper ~ * #navbar[data-transparent-mode="semifull"][data-is-home="true"].scrolled > div,
    :root.dark body:has(#banner-wrapper) #navbar[data-transparent-mode="semifull"][data-is-home="true"].scrolled > div {
        background: rgba(0, 0, 0, var(--opacity-55)) !important;
        border: 1px solid rgba(0, 0, 0, var(--opacity-55)) !important;
        box-shadow: var(--shadow-navbar-dark) !important;
    }

    /* 半完全透明模式暗色主题 - 壁纸 */
    :root.dark body.wallpaper-transparent #navbar[data-transparent-mode="semifull"][data-is-home="true"] > div {
        background: transparent !important;
        border: none !important;
        box-shadow: none !important;
    }

    /* 滚动状态暗色主题 - 壁纸 */
    :root.dark body.wallpaper-transparent #navbar[data-transparent-mode="semifull"][data-is-home="true"].scrolled > div {
        background: rgba(0, 0, 0, var(--opacity-55)) !important;
        border: 1px solid rgba(0, 0, 0, var(--opacity-55)) !important;
        box-shadow: var(--shadow-navbar-dark) !important;
    }
}

/* 平板设备优化 */
@media (min-width: 768px) and (max-width: 1023px) {
    #navbar > div {
        border-radius: 0 0 1rem 1rem !important;
    }
}

/* 小屏手机优化 */
@media (max-width: 480px) {
    #navbar > div {
        border-radius: 0 0 0.5rem 0.5rem !important;
        margin: 0 !important;
        padding-left: 1rem !important;
        padding-right: 1rem !important;
        max-width: none !important;
        width: 100% !important;
    }
}

/* 手机端导航栏全宽优化 */
@media (max-width: 768px) {
    #navbar > div {
        max-width: none !important;
        width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
}

/* 二级菜单、主题色、夜间模式菜单、手机端导航的半透明效果 */
/* 桌面端 - Banner模式 */
@media (min-width: 1024px) {
    /* 二级菜单半透明效果 */
    #banner-wrapper ~ * .dropdown-content,
    body:has(#banner-wrapper) .dropdown-content {
        backdrop-filter: blur(var(--blur-2xl)) !important;
        background: rgba(255, 255, 255, var(--opacity-90)) !important;
        border: 1px solid rgba(255, 255, 255, var(--opacity-90)) !important;
        box-shadow: var(--shadow-navbar) !important;
    }
    
    /* 主题色设置面板半透明效果 */
    #banner-wrapper ~ * #display-setting,
    body:has(#banner-wrapper) #display-setting {
        backdrop-filter: blur(var(--blur-2xl)) !important;
        background: rgba(255, 255, 255, var(--opacity-90)) !important;
        border: 1px solid rgba(255, 255, 255, var(--opacity-90)) !important;
        box-shadow: var(--shadow-navbar) !important;
    }
    
    /* 壁纸模式切换面板横幅模式透明度 */
    #banner-wrapper ~ * #wallpaper-mode-panel .float-panel,
    body:has(#banner-wrapper) #wallpaper-mode-panel .float-panel {
        backdrop-filter: blur(var(--blur-2xl)) !important;
        background: rgba(255, 255, 255, var(--opacity-90)) !important;
        border: 1px solid rgba(255, 255, 255, var(--opacity-90)) !important;
        box-shadow: var(--shadow-navbar) !important;
    }
    
    /* 主题切换面板横幅模式透明度 */
    #banner-wrapper ~ * #theme-mode-panel .float-panel,
    body:has(#banner-wrapper) #theme-mode-panel .float-panel {
        backdrop-filter: blur(var(--blur-2xl)) !important;
        background: rgba(255, 255, 255, var(--opacity-90)) !important;
        border: 1px solid rgba(255, 255, 255, var(--opacity-90)) !important;
        box-shadow: var(--shadow-navbar) !important;
    }
    
    /* 手机端导航菜单半透明效果 */
    #banner-wrapper ~ * #nav-menu-panel,
    body:has(#banner-wrapper) #nav-menu-panel {
        backdrop-filter: blur(var(--blur-2xl)) !important;
        background: rgba(255, 255, 255, var(--opacity-90)) !important;
        border: 1px solid rgba(255, 255, 255, var(--opacity-90)) !important;
        box-shadow: var(--shadow-navbar) !important;
    }
    
    /* 手机端MD导航菜单面板半透明效果 */
    #banner-wrapper ~ * #mobile-toc-panel,
    body:has(#banner-wrapper) #mobile-toc-panel {
        backdrop-filter: blur(var(--blur-2xl)) !important;
        background: rgba(255, 255, 255, var(--opacity-90)) !important;
        border: 1px solid rgba(255, 255, 255, var(--opacity-90)) !important;
        box-shadow: var(--shadow-navbar) !important;
    }
    
    /* 搜索面板半透明效果 */
    #banner-wrapper ~ * #search-panel,
    body:has(#banner-wrapper) #search-panel {
        backdrop-filter: blur(var(--blur-2xl)) !important;
        background: rgba(255, 255, 255, var(--opacity-90)) !important;
        border: 1px solid rgba(255, 255, 255, var(--opacity-90)) !important;
        box-shadow: var(--shadow-navbar) !important;
    }
}

/* 桌面端 - 壁纸模式 */
@media (min-width: 1024px) {
    /* 二级菜单半透明效果 */
    body.wallpaper-transparent .dropdown-content {
        backdrop-filter: blur(var(--blur-2xl)) !important;
        background: rgba(255, 255, 255, var(--opacity-90)) !important;
        border: 1px solid rgba(255, 255, 255, var(--opacity-90)) !important;
        box-shadow: var(--shadow-navbar) !important;
    }
    
    /* 主题色设置面板半透明效果 */
    body.wallpaper-transparent #display-setting {
        backdrop-filter: blur(var(--blur-2xl)) !important;
        background: rgba(255, 255, 255, var(--opacity-90)) !important;
        border: 1px solid rgba(255, 255, 255, var(--opacity-90)) !important;
        box-shadow: var(--shadow-navbar) !important;
    }
    
    /* 壁纸模式切换面板半透明效果 */
    body.wallpaper-transparent #wallpaper-mode-panel .float-panel {
        backdrop-filter: blur(var(--blur-2xl)) !important;
        background: rgba(255, 255, 255, var(--opacity-90)) !important;
        border: 1px solid rgba(255, 255, 255, var(--opacity-90)) !important;
        box-shadow: var(--shadow-navbar) !important;
    }
    
    /* 主题切换面板半透明效果 */
    body.wallpaper-transparent #theme-mode-panel .float-panel {
        backdrop-filter: blur(var(--blur-2xl)) !important;
        background: rgba(255, 255, 255, var(--opacity-90)) !important;
        border: 1px solid rgba(255, 255, 255, var(--opacity-90)) !important;
        box-shadow: var(--shadow-navbar) !important;
    }
    
    /* 手机端导航菜单半透明效果 */
    body.wallpaper-transparent #nav-menu-panel {
        backdrop-filter: blur(var(--blur-2xl)) !important;
        background: rgba(255, 255, 255, var(--opacity-90)) !important;
        border: 1px solid rgba(255, 255, 255, var(--opacity-90)) !important;
        box-shadow: var(--shadow-navbar) !important;
    }
    
    /* 手机端MD导航菜单面板半透明效果 */
    body.wallpaper-transparent #mobile-toc-panel {
        backdrop-filter: blur(var(--blur-2xl)) !important;
        background: rgba(255, 255, 255, var(--opacity-90)) !important;
        border: 1px solid rgba(255, 255, 255, var(--opacity-90)) !important;
        box-shadow: var(--shadow-navbar) !important;
    }
    
    /* 搜索面板半透明效果 */
    body.wallpaper-transparent #search-panel {
        backdrop-filter: blur(var(--blur-2xl)) !important;
        background: rgba(255, 255, 255, var(--opacity-90)) !important;
        border: 1px solid rgba(255, 255, 255, var(--opacity-90)) !important;
        box-shadow: var(--shadow-navbar) !important;
    }
}

/* 移动端 - Banner模式 */
@media (max-width: 1023px) {
    /* 二级菜单半透明效果 */
    #banner-wrapper ~ * #navbar[data-is-home="true"] .dropdown-content,
    body:has(#banner-wrapper) #navbar[data-is-home="true"] .dropdown-content {
        backdrop-filter: blur(var(--blur-2xl)) !important;
        background: rgba(255, 255, 255, var(--opacity-90)) !important;
        border: 1px solid rgba(255, 255, 255, var(--opacity-90)) !important;
        box-shadow: var(--shadow-navbar) !important;
    }
    
    /* 主题色设置面板半透明效果 */
    #banner-wrapper ~ * #navbar[data-is-home="true"] ~ * #display-setting,
    body:has(#banner-wrapper) #navbar[data-is-home="true"] ~ * #display-setting {
        backdrop-filter: blur(var(--blur-2xl)) !important;
        background: rgba(255, 255, 255, var(--opacity-90)) !important;
        border: 1px solid rgba(255, 255, 255, var(--opacity-90)) !important;
        box-shadow: var(--shadow-navbar) !important;
    }
    
    /* 壁纸模式切换面板移动端横幅模式透明度 */
    #banner-wrapper ~ * #navbar[data-is-home="true"] #wallpaper-mode-panel .float-panel,
    body:has(#banner-wrapper) #navbar[data-is-home="true"] #wallpaper-mode-panel .float-panel {
        backdrop-filter: blur(var(--blur-2xl)) !important;
        background: rgba(255, 255, 255, var(--opacity-90)) !important;
        border: 1px solid rgba(255, 255, 255, var(--opacity-90)) !important;
        box-shadow: var(--shadow-navbar) !important;
    }
    
    /* 主题切换面板移动端横幅模式透明度 */
    #banner-wrapper ~ * #navbar[data-is-home="true"] #theme-mode-panel .float-panel,
    body:has(#banner-wrapper) #navbar[data-is-home="true"] #theme-mode-panel .float-panel {
        backdrop-filter: blur(var(--blur-2xl)) !important;
        background: rgba(255, 255, 255, var(--opacity-90)) !important;
        border: 1px solid rgba(255, 255, 255, var(--opacity-90)) !important;
        box-shadow: var(--shadow-navbar) !important;
    }
    
    /* 手机端导航菜单半透明效果 */
    body:has(#banner-wrapper) #navbar[data-is-home="true"] #nav-menu-panel {
        backdrop-filter: blur(var(--blur-2xl)) !important;
        background: rgba(255, 255, 255, var(--opacity-90)) !important;
        border: 1px solid rgba(255, 255, 255, var(--opacity-90)) !important;
        box-shadow: var(--shadow-navbar) !important;
    }
    
    /* 手机端MD导航菜单面板半透明效果 */
    body:has(#banner-wrapper) #navbar[data-is-home="true"] #mobile-toc-panel {
        backdrop-filter: blur(var(--blur-2xl)) !important;
        background: rgba(255, 255, 255, var(--opacity-90)) !important;
        border: 1px solid rgba(255, 255, 255, var(--opacity-90)) !important;
        box-shadow: var(--shadow-navbar) !important;
    }
    
    /* 搜索面板半透明效果 */
    body:has(#banner-wrapper) #navbar[data-is-home="true"] #search-panel {
        backdrop-filter: blur(var(--blur-2xl)) !important;
        background: rgba(255, 255, 255, var(--opacity-90)) !important;
        border: 1px solid rgba(255, 255, 255, var(--opacity-90)) !important;
        box-shadow: var(--shadow-navbar) !important;
    }
    
    /* 主题色设置面板半透明效果 */
    body:has(#banner-wrapper) #navbar[data-is-home="true"] #display-setting {
        backdrop-filter: blur(var(--blur-2xl)) !important;
        background: rgba(255, 255, 255, var(--opacity-90)) !important;
        border: 1px solid rgba(255, 255, 255, var(--opacity-90)) !important;
        box-shadow: var(--shadow-navbar) !important;
    }
}

/* 移动端 - 壁纸模式 */
@media (max-width: 1023px) {
    /* 二级菜单半透明效果 */
    body.wallpaper-transparent #navbar[data-is-home="true"] .dropdown-content {
        backdrop-filter: blur(var(--blur-2xl)) !important;
        background: rgba(255, 255, 255, var(--opacity-90)) !important;
        border: 1px solid rgba(255, 255, 255, var(--opacity-90)) !important;
        box-shadow: var(--shadow-navbar) !important;
    }
    
    /* 主题色设置面板半透明效果 */
    body.wallpaper-transparent #navbar[data-is-home="true"] ~ * #display-setting {
        backdrop-filter: blur(var(--blur-2xl)) !important;
        background: rgba(255, 255, 255, var(--opacity-90)) !important;
        border: 1px solid rgba(255, 255, 255, var(--opacity-90)) !important;
        box-shadow: var(--shadow-navbar) !important;
    }
    
    /* 手机端导航菜单半透明效果 */
    body.wallpaper-transparent #navbar[data-is-home="true"] #nav-menu-panel {
        backdrop-filter: blur(var(--blur-2xl)) !important;
        background: rgba(255, 255, 255, var(--opacity-90)) !important;
        border: 1px solid rgba(255, 255, 255, var(--opacity-90)) !important;
        box-shadow: var(--shadow-navbar) !important;
    }
    
    /* 手机端MD导航菜单面板半透明效果 */
    body.wallpaper-transparent #navbar[data-is-home="true"] #mobile-toc-panel {
        backdrop-filter: blur(var(--blur-2xl)) !important;
        background: rgba(255, 255, 255, var(--opacity-90)) !important;
        border: 1px solid rgba(255, 255, 255, var(--opacity-90)) !important;
        box-shadow: var(--shadow-navbar) !important;
    }
    
    /* 搜索面板半透明效果 */
    body.wallpaper-transparent #navbar[data-is-home="true"] #search-panel {
        backdrop-filter: blur(var(--blur-2xl)) !important;
        background: rgba(255, 255, 255, var(--opacity-90)) !important;
        border: 1px solid rgba(255, 255, 255, var(--opacity-90)) !important;
        box-shadow: var(--shadow-navbar) !important;
    }
    
    /* 主题色设置面板半透明效果 */
    body.wallpaper-transparent #navbar[data-is-home="true"] #display-setting {
        backdrop-filter: blur(var(--blur-2xl)) !important;
        background: rgba(255, 255, 255, var(--opacity-90)) !important;
        border: 1px solid rgba(255, 255, 255, var(--opacity-90)) !important;
        box-shadow: var(--shadow-navbar) !important;
    }
}

/* 暗色主题下的半透明效果 - 桌面端Banner模式 */
@media (min-width: 1024px) {
    /* 二级菜单暗色主题半透明效果 */
    :root.dark #banner-wrapper ~ * .dropdown-content,
    :root.dark body:has(#banner-wrapper) .dropdown-content {
        background: rgba(0, 0, 0, var(--opacity-90)) !important;
        border: 1px solid rgba(0, 0, 0, var(--opacity-90)) !important;
        box-shadow: var(--shadow-navbar-dark) !important;
    }
    
    /* 主题色设置面板暗色主题半透明效果 */
    :root.dark #banner-wrapper ~ * #display-setting,
    :root.dark body:has(#banner-wrapper) #display-setting {
        background: rgba(0, 0, 0, var(--opacity-90)) !important;
        border: 1px solid rgba(0, 0, 0, var(--opacity-90)) !important;
        box-shadow: var(--shadow-navbar-dark) !important;
    }
    
    /* 壁纸模式切换面板暗色主题横幅模式透明度 */
    :root.dark #banner-wrapper ~ * #wallpaper-mode-panel .float-panel,
    :root.dark body:has(#banner-wrapper) #wallpaper-mode-panel .float-panel {
        background: rgba(0, 0, 0, var(--opacity-90)) !important;
        border: 1px solid rgba(0, 0, 0, var(--opacity-90)) !important;
        box-shadow: var(--shadow-navbar-dark) !important;
    }
    
    /* 主题切换面板暗色主题横幅模式透明度 */
    :root.dark #banner-wrapper ~ * #theme-mode-panel .float-panel,
    :root.dark body:has(#banner-wrapper) #theme-mode-panel .float-panel {
        background: rgba(0, 0, 0, var(--opacity-90)) !important;
        border: 1px solid rgba(0, 0, 0, var(--opacity-90)) !important;
        box-shadow: var(--shadow-navbar-dark) !important;
    }
    
    /* 手机端导航菜单暗色主题半透明效果 */
    :root.dark #banner-wrapper ~ * #nav-menu-panel,
    :root.dark body:has(#banner-wrapper) #nav-menu-panel {
        background: rgba(0, 0, 0, var(--opacity-90)) !important;
        border: 1px solid rgba(0, 0, 0, var(--opacity-90)) !important;
        box-shadow: var(--shadow-navbar-dark) !important;
    }
    
    /* 手机端MD导航菜单面板暗色主题半透明效果 */
    :root.dark #banner-wrapper ~ * #mobile-toc-panel,
    :root.dark body:has(#banner-wrapper) #mobile-toc-panel {
        background: rgba(0, 0, 0, var(--opacity-90)) !important;
        border: 1px solid rgba(0, 0, 0, var(--opacity-90)) !important;
        box-shadow: var(--shadow-navbar-dark) !important;
    }
    
    /* 搜索面板暗色主题半透明效果 */
    :root.dark #banner-wrapper ~ * #search-panel,
    :root.dark body:has(#banner-wrapper) #search-panel {
        background: rgba(0, 0, 0, var(--opacity-90)) !important;
        border: 1px solid rgba(0, 0, 0, var(--opacity-90)) !important;
        box-shadow: var(--shadow-navbar-dark) !important;
    }
}

/* 暗色主题下的半透明效果 - 桌面端壁纸模式 */
@media (min-width: 1024px) {
    /* 二级菜单暗色主题半透明效果 */
    :root.dark body.wallpaper-transparent .dropdown-content {
        background: rgba(0, 0, 0, var(--opacity-90)) !important;
        border: 1px solid rgba(0, 0, 0, var(--opacity-90)) !important;
        box-shadow: var(--shadow-navbar-dark) !important;
    }
    
    /* 主题色设置面板暗色主题半透明效果 */
    :root.dark body.wallpaper-transparent #display-setting {
        background: rgba(0, 0, 0, var(--opacity-90)) !important;
        border: 1px solid rgba(0, 0, 0, var(--opacity-90)) !important;
        box-shadow: var(--shadow-navbar-dark) !important;
    }
    
    /* 壁纸模式切换面板暗色主题全屏壁纸模式透明度 */
    :root.dark body.wallpaper-transparent #wallpaper-mode-panel .float-panel {
        background: rgba(0, 0, 0, var(--opacity-90)) !important;
        border: 1px solid rgba(0, 0, 0, var(--opacity-90)) !important;
        box-shadow: var(--shadow-navbar-dark) !important;
    }
    
    /* 主题切换面板暗色主题全屏壁纸模式透明度 */
    :root.dark body.wallpaper-transparent #theme-mode-panel .float-panel {
        background: rgba(0, 0, 0, var(--opacity-90)) !important;
        border: 1px solid rgba(0, 0, 0, var(--opacity-90)) !important;
        box-shadow: var(--shadow-navbar-dark) !important;
    }
    
    /* 手机端导航菜单暗色主题半透明效果 */
    :root.dark body.wallpaper-transparent #nav-menu-panel {
        background: rgba(0, 0, 0, var(--opacity-90)) !important;
        border: 1px solid rgba(0, 0, 0, var(--opacity-90)) !important;
        box-shadow: var(--shadow-navbar-dark) !important;
    }
    
    /* 手机端MD导航菜单面板暗色主题半透明效果 */
    :root.dark body.wallpaper-transparent #mobile-toc-panel {
        background: rgba(0, 0, 0, var(--opacity-90)) !important;
        border: 1px solid rgba(0, 0, 0, var(--opacity-90)) !important;
        box-shadow: var(--shadow-navbar-dark) !important;
    }
    
    /* 搜索面板暗色主题半透明效果 */
    :root.dark body.wallpaper-transparent #search-panel {
        background: rgba(0, 0, 0, var(--opacity-90)) !important;
        border: 1px solid rgba(0, 0, 0, var(--opacity-90)) !important;
        box-shadow: var(--shadow-navbar-dark) !important;
    }
}

/* 移动端暗色主题 - Banner模式 */
@media (max-width: 1023px) {
    /* 二级菜单暗色主题半透明效果 */
    :root.dark #banner-wrapper ~ * #navbar[data-is-home="true"] .dropdown-content,
    :root.dark body:has(#banner-wrapper) #navbar[data-is-home="true"] .dropdown-content {
        background: rgba(0, 0, 0, var(--opacity-90)) !important;
        border: 1px solid rgba(0, 0, 0, var(--opacity-90)) !important;
        box-shadow: var(--shadow-navbar-dark) !important;
    }
    
    /* 主题色设置面板暗色主题半透明效果 */
    :root.dark #banner-wrapper ~ * #navbar[data-is-home="true"] ~ * #display-setting,
    :root.dark body:has(#banner-wrapper) #navbar[data-is-home="true"] ~ * #display-setting {
        background: rgba(0, 0, 0, var(--opacity-90)) !important;
        border: 1px solid rgba(0, 0, 0, var(--opacity-90)) !important;
        box-shadow: var(--shadow-navbar-dark) !important;
    }
    
    /* 壁纸模式切换面板暗色主题移动端横幅模式透明度 */
    :root.dark #banner-wrapper ~ * #navbar[data-is-home="true"] #wallpaper-mode-panel .float-panel,
    :root.dark body:has(#banner-wrapper) #navbar[data-is-home="true"] #wallpaper-mode-panel .float-panel {
        background: rgba(0, 0, 0, var(--opacity-90)) !important;
        border: 1px solid rgba(0, 0, 0, var(--opacity-90)) !important;
        box-shadow: var(--shadow-navbar-dark) !important;
    }
    
    /* 主题切换面板暗色主题移动端横幅模式透明度 */
    :root.dark #banner-wrapper ~ * #navbar[data-is-home="true"] #theme-mode-panel .float-panel,
    :root.dark body:has(#banner-wrapper) #navbar[data-is-home="true"] #theme-mode-panel .float-panel {
        background: rgba(0, 0, 0, var(--opacity-90)) !important;
        border: 1px solid rgba(0, 0, 0, var(--opacity-90)) !important;
        box-shadow: var(--shadow-navbar-dark) !important;
    }
    
    /* 手机端导航菜单暗色主题半透明效果 */
    :root.dark body:has(#banner-wrapper) #navbar[data-is-home="true"] #nav-menu-panel {
        background: rgba(0, 0, 0, var(--opacity-90)) !important;
        border: 1px solid rgba(0, 0, 0, var(--opacity-90)) !important;
        box-shadow: var(--shadow-navbar-dark) !important;
    }
    
    /* 手机端MD导航菜单面板暗色主题半透明效果 */
    :root.dark body:has(#banner-wrapper) #navbar[data-is-home="true"] #mobile-toc-panel {
        background: rgba(0, 0, 0, var(--opacity-90)) !important;
        border: 1px solid rgba(0, 0, 0, var(--opacity-90)) !important;
        box-shadow: var(--shadow-navbar-dark) !important;
    }
    
    /* 搜索面板暗色主题半透明效果 */
    :root.dark body:has(#banner-wrapper) #navbar[data-is-home="true"] #search-panel {
        background: rgba(0, 0, 0, var(--opacity-90)) !important;
        border: 1px solid rgba(0, 0, 0, var(--opacity-90)) !important;
        box-shadow: var(--shadow-navbar-dark) !important;
    }
    
    /* 主题色设置面板暗色主题半透明效果 */
    :root.dark body:has(#banner-wrapper) #navbar[data-is-home="true"] #display-setting {
        background: rgba(0, 0, 0, var(--opacity-90)) !important;
        border: 1px solid rgba(0, 0, 0, var(--opacity-90)) !important;
        box-shadow: var(--shadow-navbar-dark) !important;
    }
    
    /* 壁纸模式切换面板暗色主题移动端横幅模式透明度 */
    :root.dark body:has(#banner-wrapper) #navbar[data-is-home="true"] #wallpaper-mode-panel .float-panel {
        background: rgba(0, 0, 0, var(--opacity-90)) !important;
        border: 1px solid rgba(0, 0, 0, var(--opacity-90)) !important;
        box-shadow: var(--shadow-navbar-dark) !important;
    }
    
    /* 主题切换面板暗色主题移动端横幅模式透明度 */
    :root.dark body:has(#banner-wrapper) #navbar[data-is-home="true"] #theme-mode-panel .float-panel {
        background: rgba(0, 0, 0, var(--opacity-90)) !important;
        border: 1px solid rgba(0, 0, 0, var(--opacity-90)) !important;
        box-shadow: var(--shadow-navbar-dark) !important;
    }
    
    /* 搜索面板暗色主题半透明效果 */
    :root.dark body:has(#banner-wrapper) #navbar[data-is-home="true"] #search-panel {
        background: rgba(0, 0, 0, var(--opacity-90)) !important;
        border: 1px solid rgba(0, 0, 0, var(--opacity-90)) !important;
        box-shadow: var(--shadow-navbar-dark) !important;
    }
}

/* 移动端暗色主题 - 壁纸模式 */
@media (max-width: 1023px) {
    /* 二级菜单暗色主题半透明效果 */
    :root.dark body.wallpaper-transparent #navbar[data-is-home="true"] .dropdown-content {
        background: rgba(0, 0, 0, var(--opacity-90)) !important;
        border: 1px solid rgba(0, 0, 0, var(--opacity-90)) !important;
        box-shadow: var(--shadow-navbar-dark) !important;
    }
    
    /* 主题色设置面板暗色主题半透明效果 */
    :root.dark body.wallpaper-transparent #navbar[data-is-home="true"] ~ * #display-setting {
        background: rgba(0, 0, 0, var(--opacity-90)) !important;
        border: 1px solid rgba(0, 0, 0, var(--opacity-90)) !important;
        box-shadow: var(--shadow-navbar-dark) !important;
    }
    
    /* 手机端导航菜单暗色主题半透明效果 */
    :root.dark body.wallpaper-transparent #navbar[data-is-home="true"] #nav-menu-panel {
        background: rgba(0, 0, 0, var(--opacity-90)) !important;
        border: 1px solid rgba(0, 0, 0, var(--opacity-90)) !important;
        box-shadow: var(--shadow-navbar-dark) !important;
    }
    
    /* 手机端MD导航菜单面板暗色主题半透明效果 */
    :root.dark body.wallpaper-transparent #navbar[data-is-home="true"] #mobile-toc-panel {
        background: rgba(0, 0, 0, var(--opacity-90)) !important;
        border: 1px solid rgba(0, 0, 0, var(--opacity-90)) !important;
        box-shadow: var(--shadow-navbar-dark) !important;
    }
    
    /* 搜索面板暗色主题半透明效果 */
    :root.dark body.wallpaper-transparent #navbar[data-is-home="true"] #search-panel {
        background: rgba(0, 0, 0, var(--opacity-90)) !important;
        border: 1px solid rgba(0, 0, 0, var(--opacity-90)) !important;
        box-shadow: var(--shadow-navbar-dark) !important;
    }
    
    /* 主题色设置面板暗色主题半透明效果 */
    :root.dark body.wallpaper-transparent #navbar[data-is-home="true"] #display-setting {
        background: rgba(0, 0, 0, var(--opacity-90)) !important;
        border: 1px solid rgba(0, 0, 0, var(--opacity-90)) !important;
        box-shadow: var(--shadow-navbar-dark) !important;
    }
}
